<div class="player">
    <div class="lock">
        <div class="left"><i></i></div>
    </div>
    <div class="hand" (mouseover)="showPlayer()"></div>
    <div class="audioBody" (mouseleave)="hidePlayer($event)">
        <div class="container">
            <div class="wrap">
                <div class="btns" style="cursor: pointer;">
                    <i class="playButton" style="color:#fff ;" nz-icon nzType="caret-right" nzTheme="outline" (click)="play()" *ngIf="playStatus"></i>
                    <i class="playButton" style="color:#fff ;" nz-icon nzType="pause" nzTheme="outline" (click)="play()" *ngIf="!playStatus"></i>
                </div>
                <div class="head">
                    <img src={{imgUrl}} class="audioImg">
                    <input type="text" disabled style="background: none;border: none;color: #fff;font-weight: bold;" value="未知歌曲" id="audioName">
                </div>
                <div class="play">
                    <div class="progress">
                        <div class="done"></div>
                    </div>
                </div>
                <div class="timeBox">
                    <input type="text" id="playedTime" value="00:00/00:00" disabled>
                </div>
            </div>
        </div>
    </div>

    <audio id="myAudio" src={{url}} autoplay duration></audio>
</div>